﻿#{set title:'Extranet' /} 
#{extends 'main.html' /}
<br>
#{if flash.success}
<div class="alert alert-success" align=center style="width:80%">
<a class=close data-dismiss="alert">x</a>
   <b> <p class="success">${flash.success}</p> </b>
</div> 
#{/if}
#{if flash.error}
<div class="alert alert-error" align=center style="width:80%">
<a class=close data-dismiss="alert">x</a>
   <b> <p class="success">${flash.error}</p> </b>
</div> 
#{/if}

<head>
<meta charset="utf-8">

<style type="text/css">
body {
	padding-top: 27px;
	padding-bottom: 40px;
}

form {
	text-align: left;
	width: 300px;
	border: 1px solid #ccc;
	padding: 15px;
	background: #fff;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	box-shadow: 0 0 4px #ccc;
	-webkit-box-shadow: 0 0 4px #ccc;
	-moz-box-shadow: 0 0 4px #ccc;
}

fieldset {
	overflow: hidden;
	border: 0;
	height: 30px;
	margin: 3px 0;
}

fieldset label {
	display: block;
	width: 100px;
	float: left;
	font-weight: 700;
	color: #666;
	line-height: 2.2em;
}

fieldset input {
	float: left;
	border: 1px solid #ccc;
	height: 20px;
	padding: 3px;
	width: 190px;
	font-size: 12px;
}

#button {
	margin-top: 10px;
	padding-right: 20px;
	text-align: right;
}

#button input {
	margin: 0 auto;
}

a.cssSubmitButton {
	font-size: 12px;
	background: #fff no-repeat 4px 5px;
	display: inline-block;
	padding: 5px 20px 6px;
	color: #333;
	border: 1px solid #ccc;
	text-decoration: none;
	font-weight: bold;
	line-height: 1.2em;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-box-shadow: 0 1px 3px #999;
	-webkit-box-shadow: 0 1px 3px #999;
	position: relative;
	cursor: pointer;
	outline: none;
}

a.cssSubmitButton:visited {
	
}

a.cssSubmitButton:hover {
	border: 1px solid #333;
}

.loading {
	background-image: url('load.gif') !important;
	color: #ccc !important;
	-moz-box-shadow: 0 0 0 #fff !important;
	-webkit-box-shadow: 0 0 0 #fff !important;
}

.effect {
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
</style>
</head>

<!-- barra superior. codigo para mostrar o nome do usuario logado -->
<div class="navbar navbar-fixed-top">
	<div class="navbar-inner">
		<div class="container">
			<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span
				class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span>
			</a> <a class="brand" align="center"> &nbsp; EXTRANET - Sistema de Controle de Tarefas</a>
			<div>
				<ul class="nav pull-right">

					<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"> Ola,
							<b>${user}</b> <b class="caret"></b>
					</a>
						<ul class="dropdown-menu">
							<li><a href="@{Application.logout()}"> <i class="icon-off"></i> Sair</a></li>
						</ul></li>
				</ul>
			</div>
		</div>
	</div>
</div>

<br><br><br>
<label><h3>Ponto Eletronico</h3></label>
<br><br>
<!-- Formulario Entrada -->
<label><b>Registrar Entrada</b></label>

<div style="float: right; margin-right: 200px">
	<table class="table table-striped table-bordered table-condensed">
		<tr>
			<td>Data</td>
			<td>Hora Entrada</td>
			<td>Hora Saida</td>
			<td>Total Trabalhado</td>
		</tr>
	#{list pontoE, as:'e'}
		<tr>
			<td>${e.data}</td>
			<td>${e.horaEntrada}</td>
			<td>${e.horaSaida}</td>
			<td>${e.totalTrabalhado}</td>
		</tr>
	#{/list}
	</table>
</div>
#{form @Horarios.registrarEntrada()}
<div id="button">
	<input type="submit" value="Registrar Entrada" name="registrar" />
</div>
#{/form}

<!-- Formulario saida -->
<label><b>Registrar Sa&iacute;da</b></label>
#{form @Horarios.registrarSaida()}
<div id="button">
	<input type="submit" value="Registrar Saída" name="registrar" />
</div>
#{/form}
